<template>
  <div class="home">
    <!-- <img alt="Vue logo" src="../assets/logo.png"> -->
    <!-- <HelloWorld msg="Welcome to Your Vue.js App"/> -->

    <myHeader :num.sync="num"></myHeader>
    <h1>{{num}}</h1>
    <button @click="num++">num++</button>


    <myModal :isShow.sync="dialogVisible"></myModal>

    <button @click="openModal">弹出模态框</button>
  </div>
</template>

<script>
// @ is an alias to /src
import HelloWorld from '@/components/HelloWorld.vue'
import myHeader from '@/components/myHeader'
import myModal from '@/components/myModal'
export default {
  name: 'HomeView',
  data() {
    return {
        num:18,
        dialogVisible:false
    }
  },
  components: {
    HelloWorld,
    myHeader,
    myModal
  },
  methods: {
    openModal(){
       this.dialogVisible = true
    }
  },
}
</script>
